<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<%@include file="mytags.jsp"%>
<t:base type="jquery"></t:base>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />
<title>手机验证</title>
    <style>

        /*.mui-input-row1{
            padding: 5px 0px 5px 0px;
        }*/
    </style>
</head>
<body>
<div class="tel"><a href="tel:400-88-22726"> <img src="${webRoot }images/tel.jpg"></a></div>
<t:formvalid formid="formobj" dialog="false" usePlugin="password" layout="table" action="" tiptype="tipType" validFormName="formValidName" showAllError="false">
	<div class="geren" style="font-weight: bold">
		<img src="${webRoot }/images/about.jpg">身份验证
	</div>
	<div class="mui-content" style=" margin: 0 auto;margin-top: 10px; width: 100%; padding: 0 15px;">
        <div style="margin: 0px 0px 7px 18px;">欢迎您加入光影俱乐部，为了给您提供更好的服务，请输入手机号进行身份验证。</div>
		<form id='login-form' class="mui-input-group">
			<div class="mui-input-row mui-input-row1">
				<input id="serviceId" name="serviceId" hidden="hidden" value="${serviceId}" >
				<label class="dg" style="width: 110px;"><img src="${webRoot }/images/phone.png" style="width: 12px">手机号</label>
				<input id='phoneNumber' type="text" class="mui-input with-border" dataType="cPhone"  nullmsg="请填写手机号" errormsg="请正确填写手机号">
			</div>
			<div class="mui-input-row mui-input-row1" style="padding-bottom:8px!important;">
				<label class="dg" style="width: 110px;"><img src="${webRoot }/images/yzm.png">验证码</label>
				<a href="javascript:sendCode()" id="sendBtn" style="float: right; display: block; width: 80px; color: #fff; background: #eb606b; border: 1px solid #e70012; margin-right: 10px; margin-top: 13px; text-align: center; border-radius: 5.5px; line-height: 25px; height: 25px;">发送验证码</a>
				<input id='phoneCode' type="text" class="mui-input with-border" style="width: 30%;">
			</div>
		</form>
	</div>
	<div class="mui-clearfix"></div>
	<div class="mui-content-padded">
		<a class="mui-btn mui-btn-block mui-btn-primary" href="javascript:validPhoneCode();">验证</a>
	</div>
</t:formvalid>
</body>

<script type="text/javascript">
/**验证提示*/
function tipType(msg,o,cssctl){
	if(o.type == 3){
		mui.toast(msg);
	}
}

//发送验证码
function sendCode(){
	//只验证   不提交
	if(formValidName.check() == false){
		$('#formobj').submit();	
	}else{
		var phoneNumber = $('#phoneNumber').val();
	 	$.post('loginWxController.do?sendWxCellphoneCode',{phoneNumber:phoneNumber},function(data){
	 		data = $.parseJSON(data);
	 		mui.toast(data.msg);
			if(data.success){
				editBtnState();
			}
	 	});
	}
	
}

//设置按钮读秒
function editBtnState(){
	
	var liveTime = <%= StaticValue.SEND_RANDOMCODE_LIVETIME%>;
	$('#sendBtn').removeAttr('href');
	$('#sendBtn').css('background-color','#D7DFE8').css('border','1px solid #D7DFE8').html(liveTime);
	$('#userName').attr('disabled','disabled');
	$('#phoneNumber').attr('disabled','disabled');
	var time = setInterval(function(){
		var ss = Number($('#sendBtn').html());
		if(ss != 0){
			$('#sendBtn').html(ss-1);
		}else{
			window.clearInterval(time);
			$('#sendBtn').css('background-color','#eb606b').css('border','1px solid #e70012').html("验证码");
			$('#sendBtn').attr('href','javascript:sendCode()');
			$('#userName').removeAttr('disabled');
			$('#phoneNumber').removeAttr('disabled');
			return;
		}
	},1000);
}

//验证验证码
function validPhoneCode(){
    //alert("验证码")
	var phoneNumber = $('#phoneNumber').val();
	var phoneCode = $('#phoneCode').val();
	var serviceId = $('#serviceId').val();
	if(phoneCode == ''){
		mui.toast('请输入验证码');
	}else{
		$.post('loginWxController.do?validWxCellphoneCode',{phoneCode:phoneCode,phoneNumber:phoneNumber,serviceId:serviceId},function(data){
			data = $.parseJSON(data);
			if(data.success){
				setTimeout('window.location.href="http://wxfw.cfg-barco.com/wechat/auth/aHR0cDovL3d4ZncuY2ZnLWJhcmNvLmNvbS9iYXJjby9odG1sL3VzZXJjZW50ZXIuaHRtbA"',1000);
				// setTimeout('window.location.href="loginWxController.do?loginRedirect&type=2"',1000);
				mui.createMask().show();
				mui.toast(data.msg);
			}else{
				mui.toast(data.msg);
			}
		});
	}
}
</script>
</html>